<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <head th:include="common/common_head :: commonHead('任务反馈表管理')"></head>
</head>
<body class="auth-user">
<div class="layui-fluid">
    <div class="layui-row larryms-panel auth-user-add" style="overflow: auto">
        <form class="layui-form" id="taskForm">
            <input type="hidden" id="id" name="id" th:value="${id}"/>
            <div id="imgs" style="padding-left: 9px;padding-right: 9px;"></div>
            <div id="videos" style="padding-left: 9px;padding-right: 9px;"></div>
        </form>
    </div>
</div>
<script type="text/javascript" th:src="@{/static/larryms/layui/layui.js}"/>
<script type="text/javascript" th:inline="javascript">/*<![CDATA[*/
var bathPath = /*[[@{/}]]*/ "/";
layui.config({
    version: ui.version,
    layertype:2,
    base: bathPath + 'static/larryms/',  //实际使用时，建议改成绝对路径
    rightMenu: "none" // false关闭，设置为custom时使用自定义，不使用默认menu
}).extend({
    larry:'js/base'
}).use(['larry','form','table','laydate','custom','upload'], function () {
    var form = layui.form , larryms = layui.larryms, $ = layui.$, beone = layui.custom, upload = layui.upload;
    var formRules = {};

    $.ajax({
        url:'/admin/task/list',
        type:"post",
        data:{
            page:1,
            rows:9999,
            id:$("#id").val()
        },
        async:false,
        success:function(d){
            var arr = d.data[0].attachmentList;
            var v = "";
            var img = "";
            var path = window.location.protocol+"//"+window.location.host+"/file/";
            console.log(arr);
            for(var i=0;i<arr.length;i++){
                if(arr[i].type == 1){
                    img += '<img src="'+(path+arr[i].name)+'" style="width: 200px;height: 260px;padding: 10px"/>';
                }else if(arr[i].type == 2){
                    v += '<video style="width: 100%;height: 200px;" src="'+(path+arr[i].name)+'" controls="controls">您的浏览器不支持 video 标签。' +
                        '</video>';
                }
            }
            $("#imgs").html(img);
            $("#videos").html(v);
        },error:function(){
            alert('error');
        }
    });
});
/*]]>*/</script>
</body>

<style>
    .preview-img {
        height: 100px;
        width: 100px;
    }
</style>
</html>